@charset "UTF-8";
/*****************************************************************************
*    Proyecto: MINHAPcontenido-firmar .container-box
*    Titulo: modMiniapplet.css
*    Desripcion: Estilos para la realizacion del modMiniapplet
****************************************************************************/

/*Inicial*/

.contenido {display: block; width: 100%; margin: 0 auto; height: auto;  position: relative;z-index:9;}/*width: 665px;min-height:40em;*/


.contenido .title {color: #dd5a00; text-align: center;margin: 0 auto; font-weight: bold; font-size:1.8em; padding-top:1em; padding-bottom:1em;}
.arrow-left-white {width: 0;height: 0;border-top: 5px solid transparent;border-bottom: 5px solid transparent;border-right: 8px solid #ffffff;display: inline-block;top: 1px;position: relative;right:5px;}


.contenido-firmar {width: 740px; }/*position: relative;*/

.contenido-firmar-listadocs {width: 740px; margin-left: auto; margin-right: auto; margin-top: 1.5em;}

.contenido-firmar-listadocs .container-box{ width: 100%;top:0.5em;position: relative;text-align: left; background-color: #eeeeee;}
.contenido-firmar .container-firmar {width: 100%; display: block; box-sizing: border-box; padding: 1.7em 0; margin-bottom: 1em;text-align: center; position: relative;}
.contenido-firmar .container-firmar .button_firmar {width: 230px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:32px;box-sizing: border-box;font-weight: bold;}
.contenido-firmar .nota-firmar{position: relative; padding: 1em; text-align: center; }


.titulo-listaDocs{display:block;font-size: large;text-align: center;margin-bottom: 0.5em;}
.cabecera-listaDocs{display: inline-block;width: 47%;padding: 0.35em;font-weight: bold;text-align: left;padding-left: 0.8em;padding-top: 0.8em;}
.celda-listaDocs{display: inline-block;width: 47%;padding: 0.35em;margin: 0.1em;vertical-align: top;padding-left: 0.7em; padding-top: 0.2em;}


.contenido-opciones {width: 100%; height:15%; display:block;position: relative;}
.contenido-opciones .botones {margin: 0 auto;text-align: center;margin-top:4em;}
.mensaje-error {color #707070;font-size: 22px;margin-bottom: 1em;text-align: center;position: relative;top:1em;}
#errorMsg{text-align: center;}



.button_firmar {text-decoration: none;}
.button_firmar:hover {text-decoration: underline; cursor:pointer;  }

.button-volver {width: 90px;padding: 0.4em 1.5em 0.4em 1.5em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size: 15px;text-align: center;box-sizing: border-box;font-weight: bold; text-decoration: none;}
.button-volver:hover {text-decoration: underline; cursor:pointer;}

.button-cancelar { width: 90px;padding: 0.4em 1.5em 0.4em 1.5em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size: 15px;text-align: center;box-sizing: border-box;font-weight: bold; cursor:pointer; text-decoration: none;}
.button-cancelar:hover {text-decoration: underline;}

.button-operacion {width: 120px;padding: 0.4em 1.5em 0.4em 1.5em;border-radius: 2em;background-color: #dd5a00;color: white;margin:  0 auto;font-size:15px;box-sizing: border-box;font-weight: bold;text-decoration: none;}
.button-operacion:hover {text-decoration: underline; cursor:pointer;}

.hide {display: none !important;}
.temp-hide {display: none;}
.bold {font-weight: bold;  }
.clear {clear: both;}
.no-float {float: none !important;}

.container-box-title{width: 100%;margin-top: 2em; display: block;position: relative;}
.container_tit{ width:100%;display:block;}
.container_btn_operation {width: 100%; display: block; margin-top: 4em; margin-bottom: 2em; text-align: center;}


.progress-dialog{display: none;background-color: rgba(50,50,50,0.3); width: 100%; height: 100%; z-index: 9990; position: fixed; left: 0; top: 0; }
.progress-dialog-window{background-color: white; position: fixed; top: 30%; left: 35%; width: 30%; padding: 20px; }/*border: 2px solid black; border-radius: 15px;*/
.progress-dialog-text{ text-align: center; font-weight: bold; font-size: 20pt; display:block;}
.progress-dialog-img{text-align: center; display:block;}
.img-loading{width:100px;height: 100px}


/***************************************************************************/


/*MEDIUM RESOLUTION STYLES*/
@media screen and (max-width: 864px) and (min-width: 681px){  

  	.contenido-error .title-error {width: 100%; margin: 0 auto;}
  	.contenido-error .container-box-error  {width: 100%; padding: 10px; box-sizing: border-box;}
  	.contenido-error .error-box .button_firmar {width: 100%; box-sizing: border-box;}
  	.contenido .main-box-left {display:inline-block; width: 235px; height: 339px;border: 1px solid rgb(216, 212, 212); box-shadow: 0px 0px 5px rgb(216, 212, 212);margin-left: 0.5em;margin-right: 0.5em; margin-bottom:1em;margin-top: 0.7em;}
 
	.contenido .title {color: #dd5a00; text-align: center;margin: 0 auto; font-weight: bold; font-size:1.5em; padding-top:1em; padding-bottom:0.3em;}
	.container-title .title-button{display: inline-block; width:30%;position: absolute; right:1%;}

	.container_btn_operation {width: 100%; display: block; margin-top: 4em; margin-bottom: 2em; text-align: center;}
	.contenido-firmar .container-firmar {width: 100%; display: block; box-sizing: border-box; padding: 1.7em 0; margin-bottom: 1em;text-align: center;position: relative;}
	.contenido-firmar .container-firmar .button_firmar {margin 0 auto;width: 180px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:22px;box-sizing: border-box;font-weight: bold;}
	.contenido-firmar .nota-firmar{display: block;position: relative;text-align: center;}

	.cabecera-listaDocs{display: inline-block;width: 40%;padding: 0.35em;font-weight: bold;text-align: left;padding-left: 0.8em;padding-top: 0.8em;}
	.celda-listaDocs{display: inline-block;width: 40%;padding: 0.35em;margin: 0.1em;vertical-align: top;padding-left: 0.7em; padding-top: 0.2em;font-size: 12px;}
	
	.contenido-firmar {width: 600px; }
	.contenido-firmar-listadocs {width: 600px; margin-left: auto; margin-right: auto; margin-top: 1.5em;}
	
	.progress-dialog-text{ text-align: center; font-weight: bold; font-size: 18pt; display:block;}
}

@media screen and (max-width: 680px)and (min-width: 576px) {  
  
  	.contenido { width: 100%; padding: 5px;  box-sizing: border-box;}

 	.contenido .main-box-left {float:none; width: 236px;  display:inline-block; margin-bottom: 1em; margin-top:1em;margin-right:0.5em; ;margin-left: 0.5em;}/*margin: 0 auto;width: 321px; */
  	.contenido .main-box-right {float:none; width: 321px; margin: 0 auto; display:block; margin-top:1em;}

	.contenido .title {color: #dd5a00; text-align: center;margin: 0 auto; font-weight: bold; font-size:1.5em; padding-top:0.3em; padding-bottom:0.3em;}
	.container-title .title-button{display: inline-block; width:20%; top:-22%; right:2%;top:1em;}/*position: absolute;*/

.container-box-title{width:90% display: block; position: relative;}/*;margin: 2em;*/
.container_tit{ width:100%;display:block;}
.container_btn_operation {width: 100%; display: block; margin-top: 4em; margin-bottom: 2em; text-align: center;}



.contenido-firmar {width: 500px; }
.contenido-firmar-listadocs {width: 500px; margin-left: auto; margin-right: auto; margin-top: 1.5em;}

.contenido-firmar .container-firmar {width: 100%; display: block; box-sizing: border-box; padding: 1.7em 0; margin-bottom: 1em;text-align: center;position: relative;}
.contenido-firmar .container-firmar .button_firmar {width: 180px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:22px;box-sizing: border-box;font-weight: bold;}
.contenido-firmar .nota-firmar{display: block;position: relative;text-align: center;}


.cabecera-listaDocs{display: inline-block;width: 40%;padding: 0.35em;font-weight: bold;text-align: left;padding-left: 0.8em;padding-top: 0.8em;}
.celda-listaDocs{display: inline-block;width: 40%;padding: 0.35em;margin: 0.1em;vertical-align: top;padding-left: 0.7em; padding-top: 0.2em;font-size: 12px;}

.progress-dialog-text{ text-align: center; font-weight: bold; font-size: 16pt; display:block;}
/* .img-loading{width: 100px;height: 100px}	 */
}

@media screen and (max-width: 575px)and (min-width: 421px) {  
	
	.contenido .title {color: #dd5a00; text-align: center;margin: 0 auto; font-weight: bold; font-size:1.2em; padding-top:1em; padding-bottom:0.3em;}
	.container-title .title-button{display: inline-block; width:30%;position: absolute; right:1%;}
		
	.container_btn_operation {width: 100%; display: block; margin-top: 4em; margin-bottom: 2em; text-align: center;}
	.contenido-firmar {width: 90%; margin-left: auto;margin-right: auto;}	
	.arrow-right {width: 0;height: 0;border-top: 5px solid transparent;border-bottom: 5px solid transparent;border-left: 8px solid #707070; display: inline-block;top: 9px;position: absolute;right: 0.3em;}
	
	.cabecera-listaDocs{display: inline-block;width: 37%;padding: 0.35em;font-weight: bold;text-align: left;padding-left: 0.8em;padding-top: 0.8em;}
	.celda-listaDocs{display: inline-block;width: 37%;padding: 0.35em;margin: 0.1em;vertical-align: top;padding-left: 0.7em; padding-top: 0.2em;font-size: 12px;}
		
	.contenido-firmar {width: 370px; }
	.contenido-firmar-listadocs {width: 370px; margin-left: auto; margin-right: auto; margin-top: 1.5em;}
	
	.contenido-firmar .container-firmar .button_firmar {width: 180px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:22px;box-sizing: border-box;font-weight: bold;}
	
}

@media screen and (max-width: 420px) {  

	.contenido .title {color: #dd5a00; text-align: center;margin: 0 auto; font-weight: bold; font-size:1em; padding-top:1em; padding-bottom:1em;}
		
	.container_tit{ width:100%;display:block; }
	
  	.contenido-firmar {width: 270px;position: relative;}
  	.contenido-firmar .container-firmar {width: 100%; display: block; box-sizing: border-box; padding: 1.7em 0; margin-bottom: 1em;text-align: center;position: relative;}
	.contenido-firmar .container-firmar .button_firmar {margin 0 auto;width: 230px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:32px;box-sizing: border-box;font-weight: bold;}
	.contenido-firmar .nota-firmar{display:block; position: relative;text-align: center;}	
	
	.contenido-firmar .container-firmar .button_firmar {width: 170px;padding: 0.2em 2em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 0 auto;font-size:22px;box-sizing: border-box;font-weight: bold;}
	
	.mensaje-error {color #707070;font-size: 14px;margin-bottom: 1em;text-align: center;position: relative;}
	/*.button-operacion {width: 130px;padding: 0.2em 1em;border-radius: 2em;background-color: #dd5a00;color: white;margin: 1.2em 1em;font-size:12px;box-sizing: border-box;font-weight: bold;text-decoration: none;}*/
	
	.button-operacion {width: 120px;padding: 0.4em 1.5em 0.4em 1.5em;border-radius: 2em;background-color: #dd5a00;color: white;margin:  0 auto;font-size:15px;box-sizing: border-box;font-weight: bold;text-decoration: none; display: block;}
	
	#progressText{font-size: 12pt;}
	.progress-dialog-text{ text-align: center; font-weight: bold;  display:block;}
	.img-loading{width: 50px;height: 50px;}

	.cabecera-listaDocs{display: inline-block;width: 37%;padding: 0.35em;font-weight: bold;text-align: left;padding-left: 0.8em;padding-top: 0.8em;}
	.celda-listaDocs{display: inline-block;width: 37%;padding: 0.35em;margin: 0.1em;vertical-align: top;padding-left: 0.7em; padding-top: 0.2em;font-size: 12px;}
		
	.contenido-firmar {width: 90%; }
	.contenido-firmar-listadocs {width: 90%; margin-left: auto; margin-right: auto; margin-top: 1.5em;}
}
